<template>
  <div>
    {{ home.count }}<br>
    {{ home.doubleCount }}<br>
    <button @click="home.addCount">Click me!</button>
  </div>
  <div>
    {{ user.count }}<br>
    {{ user.doubleCount }}<br>
    <button @click="user.addCount">Click me!</button>
  </div>
  <div>
    {{ lesson.count }}<br>
    {{ lesson.doubleCount }}<br>
    <button @click="lesson.addCount">Click me!</button>
  </div>
</template>

<script setup>
import { useStore } from 'vuex'
import { useHome } from "../hooks/home";
import { useLesson } from "../hooks/lesson";
import { useUser } from "../hooks/user";

const store = useStore()
const home = useHome(store)
const user = useUser(store)
const lesson = useLesson(store)
</script>

<style scoped>

</style>